<nav id ="navbar" th:fragment="navbar" class="navbar navbar-default ">
    <div class="tz-container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
							<span class="sr-only">
								导航
							</span>
                <span class="icon-bar">
							</span>
                <span class="icon-bar">
							</span>
                <span class="icon-bar">
							</span>
            </button>
            <a class="logo-a" th:href="@{/}">
                <img th:src="@{|/${WEB_THEME}/source/img/logo.png|}" alt="logo" />
            </a>
        </div>
        <div class="collapse navbar-collapse navbar-right" aria-expanded="false">
            <ul class="nav navbar-nav">
                <li th:class="${categoryId=='index' ? 'active' : ''} ">
                    <a th:href="@{/}">
                        首页
                    </a>
                </li>
                <li th:each="category:${CATEGORY_LIST}" th:class="${category.id==categoryId ? 'active':(#lists.isEmpty(category.children)?'':'dropdown')}">
                    <a th:if="${category.pid==null||category.pid==0}" th:href="@{${not #lists.isEmpty(category.children)? '#': ('/blog/category/' + category.id)}}" th:class="${#lists.isEmpty(category.children)?'':'dropdown-toggle'}" th:data-toggle="${#lists.isEmpty(category.children)?'':'dropdown'}">
                        <span th:text="${category.name}"></span>
                        <b th:if="${not #lists.isEmpty(category.children)}" class="caret"></b>
                    </a>
                    <ul th:if="${not #lists.isEmpty(category.children)}" class="dropdown-menu">
                        <li th:each="node:${category.children}"><a th:href="@{${'/blog/category/' + node.id}}" th:text="${node.name}"></a></li>
                    </ul>

                </li>
                <li class="">
                    <a th:href="@{/feedback}" th:class="${categoryId=='comment' ? 'active' : ''} ">
                        留言板
                    </a>
                </li>
              <li>
                  <form action="/search" id="searchForm" class="navbar-form">
                      <div class="form-group">
                          <div class="input-group">
                              <input type="search" id="search" name="keywords" th:value="@{${keywords}}" placeholder="搜索文章..." class="form-control">
                              <span class="input-group-addon"><a href="#" onclick="searchBlog()"><span class="glyphicon glyphicon-search"></span></a></span>
                          </div>
                      </div>
                  </form>
                </li>
            </ul>
        </div>
    </div>
</nav>
<script>
    function searchBlog() {
      var  keywords=document.getElementById('search').value;
      window.location.href='/search/'+keywords;
    }
</script>
